<template>
    <!-- 用餐台账 -->
    <base-breadcrumb :title="$route.meta.title">
        <!-- 搜索 -->
        <searchData :searchData="searchArr" @search="search"></searchData>
        <!-- 表格 -->
        <a-card :bordered="false">
            <!-- <title-name :title="$route.meta.title"></title-name> -->
            <a-alert class="mb12 mt12" type="info" show-icon>
                <template slot="message">
                    <span>
                        总金额
                        <a>{{ form.total }}</a>
                        元
                    </span>
                </template>
            </a-alert>
            <!-- 表格 -->
        <list-table
            ref="table"
            rowKey="key"
            :columns="columns"
            :request="loadData"
            :alert="true"
        >
        <span slot="index" slot-scope="text, record, index">{{ index + 1 }}</span>
                <template slot="action" slot-scope="text, record">
                    <a @click="handleManage(0, record)" v-btnPermission="'oa_015_loo_01'">查看</a>

                    <a-divider type="vertical"></a-divider>
                    <service-export-mould
                        v-btnPermission="'oa_015_exp_02'"
                        url="/officeCanteenPeople/officeCanteenPeopleExportReport"
                        :requestParams="record"
                        icon="cloud-download"
                        :isButton="false"
                    ></service-export-mould>
                </template>
            </list-table>
        </a-card>
                <eat-modal
            v-if="visible.update"
            :init-data="childInitData"
            @cancel="visible.update = false"
            @confirm="handleUpdateConfirm"
        />
    </base-breadcrumb>
</template>

<script>
// import { STable } from '@/components' // 表格
import { getPageSelectReportByMonth, getSelectReportByMonthTotal } from '@/api/office/canteen' // api
import BasePage from '@/views/basePage' // 基础配置
import SelectCompanyAndProject from '@/components/Select/SelectCompanyAndProject'
import ServiceExportMould from '@/components/ServiceExportMould'
import OrgTreeSelect from '@/components/OrgTreeSelect/index'
const searchArr = [
    // 搜索框
    {
        name: '单位',
        valueKey: 'searchQuery',
        type: OrgTreeSelect,
    },
    {
        name: '用餐月份',
        type: 'monthRange',
        value: 'mealMonthTime',
        attr: {
            rangeFormat: ['mealMonthTimeStart', 'mealMonthTimeEnd'],
        },
    },
]
const columns = [
    {
        title: '序号',
        width: 80,
        dataIndex: 'index',
        scopedSlots: { customRender: 'index' }
    },
    {
        title: '单位',
        dataIndex: 'unitName',
    },
    {
        title: '用餐月份',
        ellipsis: true,
        dataIndex: 'mealMonthTime',
    },
    {
        title: '早餐人数',
        ellipsis: true,
        dataIndex: 'breakfast',
    },
    {
        title: '早餐金额(元)',
        ellipsis: true,
        dataIndex: 'breakfastMoney',
    },
    {
        title: '午餐人数',
        ellipsis: true,
        dataIndex: 'lunch',
    },
    {
        title: '午餐金额(元)',
        ellipsis: true,
        dataIndex: 'lunchMoney',
    },
    {
        title: '晚餐人数',
        ellipsis: true,
        dataIndex: 'dinner',
    },
    {
        title: '晚餐金额(元)',
        ellipsis: true,
        dataIndex: 'dinnerMoney',
    },
    {
        title: '月合计金额(元)',
        ellipsis: true,
        dataIndex: 'monthMoney',
    },
    {
        title: '操作',
        dataIndex: 'action',
        width: '180px',
        align: 'center',
        scopedSlots: { customRender: 'action' },
    },
]

export default {
  name:'a'+Date.now(),
  extends: new BasePage(),
    components: {
        // STable,

        ServiceExportMould,
    },
    data() {
        this.columns = columns
        this.searchArr = searchArr
        return {
            visible: {
                update: false,
            },
            loading: false,
            queryParam: {}, // 查询参数

            loadData: (parameter) => {
                const requestParameters = Object.assign({}, parameter, { query: this.queryParam })
                this.getSelectReportByMonthTotal(requestParameters)
                return getPageSelectReportByMonth(requestParameters).then((res) => {
                    res.data.forEach((element, i) => {
                        res.data.key = i
                    })
                    return res
                })
            }, // 加载数据方法 必须为 Promise 对象

            editModel: 0,
            form: {},
            total: '',
        }
    },
    methods: {
        // 搜索
        search(value) {
            value && (this.queryParam = value)
            this.$refs.table.refresh(true)
        },
        getSelectReportByMonthTotal(requestParameters) {
            getSelectReportByMonthTotal(requestParameters).then((res) => {
                this.form = res.data
            })
        },
        handleUpdateConfirm() {
            this.visible.update = false
            this.$refs.table.refresh(true)
        },
        // 操作栏
        handleManage(type, record) {
            this.editModel = type
            if (type == 1) {
                this.childInitData = {
                    ...record,
                    pageType: type,
                }
                this.visible.update = true
                return
            }

            let query = record
            this.$router.push({
                name: '/office/canteen/diningParameter/updatedDiningParameter',
                query,
            })
        },
    },
}
</script>
